<!DOCTYPE html>
<html>
	{include file="head.html"}
	<style>
		.w200{
			max-width: 200px;
		}
	</style>
	<body>
		<div class="tabs-border">
			<div class="item active">和{$user.nickname}对话</div>
		</div>
		<div id="app" class="main-body" >
			<div v-if="pageLoad" class="list" >
				 
				<div v-for="(item,index) in pageData.list" :key="index" class="bg-white pd-10">
					 
					<div  v-if="item.tablename!='user'">
							<div class="flex cl2 mgr-5 flex-ai-center mgb-5">
								我 <div class="cl3 f12 mgl-20">{{item.createtime}}</div>
							</div>
							<div class="cl3">{{item.content}}</div>
						  
					</div>
					<div   v-else>
				 
						<div class="cl2 flex flex-ai-center mgb-5"> {$user.nickname} <div class="cl3 f12 mgl-5">{{item.createtime}}</div></div>
						<div class="cl3  flex">
							{{item.content}}
						</div>
						
					 
				 
				 
					</div>
				</div>
	 
			</div>
			<div class="footer-row"></div>
			<div style="position: fixed;bottom: 0;left: 0;right: 0;">
				<div class="input-flex">
					<input type="text" id="content" class="input-flex-text" />
					<div class="input-flex-btn" id="submit">发送</div>
				</div>
			</div>
		</div>
		{include file="footer.html"}
		<script src="/plugin/vue/vue.min.js"></script>
		
		<script>
			var userid="{$userid}";
			var app=new Vue({
				el:"#app",
				data:function(){
					return {
						pageLoad:false,
						pageData:[],
						content:""
					}
				},
				created:function(){
					this.getPage();
					setInterval(function(){
						app.getPage();
					},10000)
				},
				methods:{
					getPage:function(){
						var that=this;
						$.ajax({
							url:"/admin.php?m=kefu&a=data&ajax=1",
							data:{
								userid:userid
							},
							dataType:"json",
							success:function(res){
								that.pageLoad=true;
								that.pageData=res.data
								that.$nextTick(function(){
									window.scrollTo(0,10000);
								})
							}
						})
					},
					submit:function(){
						var that=this;
						$.ajax({
							url:"/admin.php?m=kefu&a=save&ajax=1",
							type:"POST",
							dataType:"json",
							data:{
								content:this.content,
								userid:userid
							},
							success:function(res){
								skyToast(res.message);
								if(res.error){
									return false;
								}
								that.content="";
								that.getPage();
							}
						})
					}
				}
			})
			 
		</script>
	</body>
</html>
